(function ($) {
  $(function() {
    navigationInit();
  });  
  
  /**
   *  Integrates the header into Google Maps' control grid.
   *  Adds event listeners for click-event on links.
   */
  navigationInit = function(){
    // Integrating the header into Google Maps' control grid
    var header = $("#header")[0];
    map.controls[google.maps.ControlPosition.TOP_CENTER].push(header);
    
    // Adding click event to links
    $("#navigation").find(" ul li a").each(function(i){
      $(this).click(function(event){
        event.preventDefault();
        
        // Getting index of the link
        var index = $("#navigation").find(" ul li a").index($(this));
        
        // Moving to start.center if first element was clicked
        // else opening the InfoBox matching to index
        if (index == 0){
          map.setZoom(start.zoom);
          setTimeout(function(){ map.panTo(start.center); }, 250);
        }
        else {
          // index of content starts at 0 but in navigation chapters start at 1
          openInfoBox(index-1);
        }
        
        // Assign active status/class to the clicked link
        navigationHighlight(index);
      });      
    });
  }
  
  /**
   * Highlights the navigation element matching
   * the visible content chapter
   */
  navigationHighlight = function(index){
    var links = $("#navigation").find(" ul li a");
    // Removing all highlights
    links.removeClass("active");
    // If index is negative no element gets highlighted
    if (index >= 0)
      links.eq(index).addClass("active");
  }
} )( jQuery );
